<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
      xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head th:include="include :: header"></head>
<body class="hold-transition skin-yellow sidebar-mini">

<div class="modal fade" data-backdrop="static" data-keyboard="false" id="modal-infor">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">拆分数量</h4>
            </div>
            <div class="modal-footer">
                <form id="inforForm" class="form-horizontal">
                    <input type="hidden" name="id">
                    <div class="col-md-12">
                        <div class="form-group">
                            <label class="col-sm-2 control-label" >生产令号</label>
                            <div class="col-sm-10">
                                <input name="prodNo" type="text" class="form-control" readonly>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label" >项目名称</label>
                            <div class="col-sm-10">
                                <input name="proName" type="text" class="form-control" readonly>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label" >物料描述</label>
                            <div class="col-sm-10">
                                <input name="malDesc" type="text" class="form-control"  readonly>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label" >数量</label>
                            <div class="col-sm-10">
                                <input type="number" class="form-control" name="num">
                            </div>
                        </div>
                    </div>
                </form>
                <button type="button" class="btn btn-info" id="infor-edit">
                    确定
                </button>
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
            </div>
        </div>
    </div>
</div>

<section class="content-header">
    <h1>外购件计划拆分</h1>
</section>
<section class="content">
    <div class="row">
        <div class="col-xs-12">
            <div class="box">
                <div class="box-header">
                    <form id="queryForm" onsubmit="return false;">
                        <input type="hidden" name="id" id="id" th:value="${selectOne.id}">
                        <div class="row">
                            <div class="form-inline">
                                <div class="form-group">
                                    <label for="query-proCode">项目编号</label>
                                    <input id="query-proCode" type="text" name="proCode" class="form-control"
                                           style="border: none;width: 100Px;background-color: white"
                                           th:value="${selectOne.proCode}" readonly>
                                </div>
                                <div class="form-group">
                                    <label for="query-proName">项目名称</label>
                                    <input id="query-proName" type="text" name="proName" class="form-control"
                                           style="border: none;width: 250px;background-color: white"
                                           th:value="${selectOne.proName}" readonly>
                                </div>
                                <div class="form-group">
                                    <label for="query-proNum">项目数量</label>
                                    <input id="query-proNum" type="text" name="proNum" class="form-control"
                                           style="border: none;width: 50PX;background-color: white"  th:value="${selectOne.proNum}" readonly>
                                </div>
                                <div class="form-group">
                                    <label for="query-prodIsKey">是否重点</label>
                                    <input id="query-prodIsKey" type="text" name="prodIsKey" class="form-control"
                                           style="border: none;width: 77px;background-color: white"
                                           th:value="${selectOne.prodIsKey}==1?'是':'否'" readonly>
                                </div>
                                <div class="form-group">
                                    <label for="query-malType">专业</label>
                                    <input id="query-malType" type="text" name="proName" class="form-control"
                                    style="border: none;width: 77px;background-color: white" th:value="${selectOne.malType}" readonly>
                                </div>
                                <div class="form-group">
                                    <label for="query-part">部分</label>
                                    <input id="query-part" type="text" name="part" class="form-control"
                                           style="border: none;width: 200px;background-color: white"
                                           th:value="${selectOne.part}" readonly>
                                </div>
                                <div class="form-group">
                                    <label for="query-postName">提报人</label>
                                    <input id="query-postName" type="text" name="postName" class="form-control"
                                           style="border: none;width: 77px;background-color: white" th:value="${selectOne.postName}" readonly>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="form-inline" th:each="plan : ${selectList}">
                                <div class="form-group">
                                    <label for="query-proCode">生产令编号</label>
                                    <input id="query-proCode1" type="text" name="proCode" class="form-control"
                                           style="border: none;width: 200Px;background-color: white" th:value="${plan.prodNo}" readonly>
                                </div>
                                <div class="form-group">
                                    <label for="query-proName">生产令名称</label>
                                    <input id="query-proName1" type="text" name="proName" class="form-control"
                                           style="border: none;width: 300px;background-color: white" th:value="${plan.proName}" readonly>
                                </div>
                                <div class="form-group">
                                    <label for="query-proNum">数量</label>
                                    <input id="query-proNum1" type="text" name="proNum" class="form-control"
                                           style="border: none;width: 50PX;background-color: white"  th:value="${plan.prodNum}" readonly>
                                </div>
                            </div>
                            <div style="margin-right: 400px;margin-top:-60px; position:relative;float:right;">
                                <button type="button" class="btn btn-warning"
                                        onclick="fb()">
                                    <span class="Bold">自动拆分</span>
                                </button>&nbsp;&nbsp;&nbsp;&nbsp;
                                <button type="button" class="btn btn-success" id="btn-commit" style="display:none;">
                                    <span class="Bold">提交</span>
                                </button>
                            </div>
                        </div>
                    </form>
                </div>
                <div class="box-body">
                    <table id="t1" class="t1">
                        <thead>
                            <tr>
                                <td></td>
                                <td style="width: 4%;">序号</td>
                                <td colspan="2">物料描述</td>
                                <td colspan="1">数量</td>
                                <td style="width: 8%">单位</td>
                                <td colspan="2">型号</td>
                                <td colspan="2">品牌</td>
                                <td colspan="2">备注</td>
                                <td colspan="2">变更原因</td>
                                <td colspan="2">附件</td>
                            </tr>
                        </thead>
                        <tbody>
                            <tr th:each="plan : ${selectAll}">
                                <td th:if="${planStat.index == 0}" th:rowspan="${planStat.size}">更改前</td>
                                <td th:text="${planStat.count}">1</td>
                                <td colspan="2" th:text="${plan.malDesc}"></td>
                                <td colspan="1" th:text="${plan.num}"></td>
                                <td th:text="${plan.unit}"></td>
                                <td colspan="2"th:text="${plan.standard}"></td>
                                <td colspan="2" th:text="${plan.brand}"></td>
                                <td colspan="2" th:text="${plan.remark}"></td>
                                <td colspan="2"></td>
                                <td colspan="2">
                                    <a th:if="${plan.url}" target="_blank" th:href="${plan.url}">下载</a>
                                </td>


                            </tr>
                            <tr th:each="plan : ${selectAll}" th:class="${planStat.index == 0 ? 'after-tr' : ''}">
                                <td th:if="${planStat.index == 0}" th:rowspan="${planStat.size}">更改后</td>
                                <td th:text="${planStat.count}">1</td>
                                <td colspan="2" th:text="${plan.afterMalDesc}"></td>
                                <td colspan="1"th:text="${plan.afterNum}"></td>
                                <td th:text="${plan.afterUnit}"></td>
                                <td colspan="2"th:text="${plan.afterStandard}"></td>
                                <td colspan="2" th:text="${plan.afterBrand}"></td>
                                <td colspan="2" th:text="${plan.afterRemark}"></td>
                                <td colspan="2" th:text="${plan.changeReason}"></td>
                                <td colspan="2">
                                    <a th:if="${plan.afterUrl}" target="_blank" th:href="${plan.afterUrl}">下载</a>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                    <form id="queryForm2" onsubmit="return false;">
                        <input type="hidden" name="id" th:value="${selectOne.id}">
                        <table id="bootstrap-table2"></table>
                    </form>
                </div>
            </div>
        </div>
    </div>
</section>
<div th:include="include :: footer"></div>
<script th:inline="javascript">

    let table,data=[],table2;

    $(function () {
        $("#t1 thead tr").each(function (i,v) {
            $("#t2 thead tr").eq(i).find("td").first().height($(this).find("td:first").height());
        })

        $("#t1 tbody tr").each(function (i,v) {
            $("#t2 tbody tr").eq(i).find("td").first().height($(this).find("td:last").height());
        })
    });


    function fb(){
        $("#btn-commit").show();

        /** 子表 */
        table2 = js.table.init({
            id: "bootstrap-table2",
            firstLoad: false,
            escape: true,
            data:getData(),
            pagination: false,
            pageSize: 1000,
            showExport: false,
            sidePagination: 'client',
            search:true, //******开启搜索框****//
            strictSearch:true,  //******完全匹配****//
            trimOnSearch:true, //去除关键词空格//
            searchAlign:'left',
            toolbar:'#toolbar',
            columns: [
                {
                    title: '序号', field: 'id', width: '50',
                    formatter: function (value, row, index) {
                        return index + 1;
                    }
                },
                {title: "id", field: 'sheetId', visible: false},
                {title: "planId", field: 'planId',visible: false},
                {title: "prodNum", field: 'prodNum',visible: false},
                {title: "changePlanId", field: 'changePlanId',visible: false},
                {title: "项目名称", field: 'proName'},
                {title: "生产令编码", field: 'prodNo'},
                {title: "物料描述", field: 'malDesc'},
                {title: "数量", field: 'splitNum',
                    formatter: function (value, row) {
                   ;
                        if(value){
                            return'<input type="number"  step="0.1" id="reason" style="border: none;width: 50px" data-index="'+row.modifyTag+'" onchange="changeReason(this)" value="'+value+'" />'
                        }else{
                            return'<input type="number"  step="0.1" id="reason" style="border: none;width: 50px;color: red" data-index="'+row.modifyTag+'" onchange="changeReason(this)" value=0 />'

                        }
                    }
                },
                {title: "单位", field: 'unit'},
                {title: "型号/标准号", field: 'standard'},
                {title: "品牌", field: 'brand'},
                {title: "备注", field: 'remark'},
                {title: "变更原因", field: 'changeReason'},
                {title: "附件", field: 'url',
                    formatter: function (value) {
                        if (value) {
                            return '<a target="_blank" href="' + value + '">下载</a>'
                        }
                        return value;
                    }
                }
            ],
        });
    }
    /** 改变table表格内容是触发*/
    function changeReason(e) {
        var value = $(e).val();
        var index = $(e).attr("data-index");
        data[index-1].splitNum = value;
    }

    /** 获取后台的拆分数据*/
    function getData() {
        js.post({
            url: ctx + "purch/autoChaSplit",
            async: false,
            data:{id:$("#id").val()},
            success: function (result) {
                if (result.type === web_status.SUCCESS) {
                    data = result.data.rows;
                } else {
                    js.modal.warning(result.msg);
                }
            }
        });
        return data;
    }


    /** 查询提报计划的明细*/
    function selectDetail(row){

        window.open(ctx + 'purch/selectDetail?id=' + row.id + '&sheetType='+row.sheetType);
    }

    /** 拆分提交到B表保存*/
    $("#btn-commit").click(function () {
        let tableNode = $("#bootstrap-table2");
        tableNode.bootstrapTable("resetSearch","");
        tableNode.bootstrapTable('refresh');

        var allTableData = $('#bootstrap-table2').bootstrapTable('getData');
        js.post({
            url: ctx + "purch/confirmCha",
            data:{
                allTableData: JSON.stringify(allTableData),
            },
            success: function (result) {
                if (result.type === web_status.SUCCESS) {
                    if(result.data==-2){
                        js.modal.warning(result.msg)
                        return ;
                    }
                    js.modal.success(result.msg);
                    location.href = ctx + "purch";
                } else {
                    js.modal.warning(result.msg);
                }
            }
        });
    });



</script>
</body>
</html>
